<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>天气预报</title>
	<style>
		body {
			font-size: 17px;
		}

		ul,
		li {
			list-style: none;
			margin: 0px;
			padding: 0px;
		}

		li {
			float: left;
			border: 1px solid #D4D4D4;
			text-align: center;
			border-radius: 20px;
			width: 32%;
		}

		li p {
			text-align: center;
		}

		li:first-child {
			background-color: rgba(199, 166, 4, 0.1);
		}
		div {
			float: left;
			width: 32%;
		}
	</style>
</head>

<body>
	<ul>
		<li>
			<p>今天</p>
			<img src="" />
			<p>晴天</p>
		</li>
		<li>
			<p>明天</p>
			<img src="" />
			<p>阴天</p>
		</li>
		<li>
			<p>后天</p>
			<img src="" />
			<p>小雨</p>
		</li>
	</ul>
	
		<div>今天天气晴<br />气温35℃<br />出门注意防晒</div>
		<div>明天阴天<br />气温28℃<br />适合室外活动</div>
		<div>后天小雨<br />气温27℃<br />出门记得带伞</div>
	
</body>

</html>